<template>
    <div class="body z_user_vs" v-if="JSON.stringify(userInfo) != '{}'">
        <!-- 顶部 -->
        <div class="j_user_header">
            <dl>
                <dd>
                    <h4>
                        <img :src="userInfo.head_pic" alt="用户头像" />
                    </h4>

                    <div>
                        <h2>
                            {{ userInfo.nickname }}
                            <span class="identify" v-show="userInfo.is_identify"
                                >已认证</span
                            >
                            <span
                                class="identify"
                                v-show="!userInfo.is_identify"
                                >未认证</span
                            >
                        </h2>
                        <h3>ID:{{ userInfo.user_id }}</h3>
                    </div>
                </dd>

                <dt>
                    <h1>
                        <a @click="$router.push('/userinfo')">
                            <img
                                src="../../assets/newimg/user/my_icon_shezhi@2x.png"
                                alt=""
                            />
                        </a>
                    </h1>
                    <a @click="$router.push('/message')">
                        <h2>
                            <img
                                src="../../assets/newimg/index/home_icon_xiaoxi@2x.png"
                                alt=""
                            />
                            <span class="j_num">2</span>
                        </h2>
                    </a>
                </dt>
            </dl>

            <div class="j_ordernav j_navbox">
                <a
                    @click="
                        $router.push({ path: '/allOrder', query: { type: '' } })
                    "
                >
                    <h1>
                        <div>
                            <img
                                src="../../assets/newimg/user/my_icon_quanbu@2x.png"
                                alt=""
                            />
                            <span
                                class="j_num"
                                v-show="userInfo.allOrder > 0"
                                >{{ userInfo.allOrder }}</span
                            >
                        </div>
                    </h1>
                    <p>全部订单</p>
                </a>
                <b></b>
                <a
                    @click="
                        $router.push({
                            path: '/allOrder',
                            query: { type: 'WAITPAY' },
                        })
                    "
                >
                    <h1>
                        <div>
                            <img
                                src="../../assets/newimg/user/my_icon_daifk@2x.png"
                                alt=""
                            />
                            <span class="j_num" v-show="userInfo.waitPay > 0">{{
                                userInfo.waitPay
                            }}</span>
                        </div>
                    </h1>
                    <p>待付款</p>
                </a>
                <a
                    @click="
                        $router.push({
                            path: '/allOrder',
                            query: { type: 'WAITSEND' },
                        })
                    "
                >
                    <h1>
                        <div>
                            <img
                                src="../../assets/newimg/user/my_icon_daifh@2x.png"
                                alt=""
                            />
                            <span
                                class="j_num"
                                v-show="userInfo.waitSend > 0"
                                >{{ userInfo.waitSend }}</span
                            >
                        </div>
                    </h1>
                    <p>待发货</p>
                </a>
                <a
                    @click="
                        $router.push({
                            path: '/allOrder',
                            query: { type: 'WAITRECEIVE' },
                        })
                    "
                >
                    <h1>
                        <div>
                            <img
                                src="../../assets/newimg/user/my_icon_daifh@2x(1).png"
                                alt=""
                            />
                            <span
                                class="j_num"
                                v-show="userInfo.waitReceive > 0"
                                >{{ userInfo.waitReceive }}</span
                            >
                        </div>
                    </h1>
                    <p>待收货</p>
                </a>
                <a @click="$router.push('/orderDiscuss')">
                    <h1>
                        <div>
                            <img
                                src="../../assets/newimg/user/my_icon_daipj@2x.png"
                                alt=""
                            />
                            <span
                                class="j_num"
                                v-show="userInfo.uncomment_count > 0"
                                >{{ userInfo.uncomment_count }}</span
                            >
                        </div>
                    </h1>
                    <p>待评价</p>
                </a>
                <a v-show="false">
                    <h1>
                        <div>
                            <img
                                src="../../assets/newimg/user/my_icon_shouhou@2x.png"
                                alt=""
                            />
                            <span
                                class="j_num"
                                v-show="userInfo.return_count > 0"
                                >{{ userInfo.return_count }}</span
                            >
                        </div>
                    </h1>
                    <p style="margin-top: 0.16rem">售后</p>
                </a>
            </div>

            <div class="j_title" style="padding-top: 0.4267rem">
                <span>我的服务</span>
            </div>
            <!-- 我的服务start -->
            <div class="j_fuwu">
                <div
                    class="j_ordernav j_ordebox"
                    @click="
                        $router.push({ path: '/collect', query: { type: 0 } })
                    "
                >
                    <a>
                        <h1>
                            <div>
                                <img
                                    src="../../assets/newimg/user/my_icon_kec@2x.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>我的课程</p>
                    </a>
                    <a
                        @click="
                            $router.push({
                                path: '/collect',
                                query: { type: 1 },
                            })
                        "
                    >
                        <h1>
                            <div>
                                <img
                                    src="../../assets/newimg/user/my_icon_baox@2x.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>我的保险</p>
                    </a>
                    <a
                        @click="
                            $router.push({
                                path: '/collect',
                                query: { type: 2 },
                            })
                        "
                    >
                        <h1>
                            <div>
                                <img
                                    src="../../assets/newimg/user/my_icon_daik@2x.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>我的贷款</p>
                    </a>
                </div>
            </div>
            <!-- 个人相关 -->
            <div
                class="j_title"
                style="padding-top: 0.4267rem"
                v-if="userInfo.job_utype === 2"
            >
                <span>个人相关</span>
            </div>
            <div class="j_fuwu" v-if="userInfo.job_utype === 2">
                <div class="j_ordernav j_ordebox">
                    <a @click="$router.push('/editJianli')">
                        <h1>
                            <div style="width: 0.9173rem">
                                <img
                                    src="../../assets/newimg/user/my_icon_mianshiyaoqing@2x.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>我的简历</p>
                    </a>
                    <a
                        @click="
                            $router.push({
                                path: '/zhiweiList',
                                query: { type: 0 },
                            })
                        "
                    >
                        <h1>
                            <div style="width: 0.832rem">
                                <img
                                    src="../../assets/newimg/user/my_icon_yisq.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>已申请职位</p>
                    </a>
                    <a
                        @click="
                            $router.push({
                                path: '/zhiweiList',
                                query: { type: 1 },
                            })
                        "
                    >
                        <h1>
                            <div style="width: 1.088rem">
                                <img
                                    src="../../assets/newimg/user/my_icon_yaoqing.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>面试邀请</p>
                    </a>
                </div>
            </div>
            <!-- 企业相关 -->
            <div
                class="j_title"
                style="padding-top: 0.4267rem"
                v-if="userInfo.job_utype === 1"
            >
                <span>企业相关</span>
            </div>
            <div class="j_fuwu" v-if="userInfo.job_utype === 1">
                <div class="j_ordernav j_ordebox">
                    <a @click="$router.push('/publishJob')">
                        <h1>
                            <div style="width: 1.088rem">
                                <img
                                    src="../../assets/newimg/user/my_icon_fabu.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>发布职位</p>
                    </a>
                    <a @click="$router.push('/positionManagement')">
                        <h1>
                            <div style="width: 1.088rem">
                                <img
                                    src="../../assets/newimg/user/my_icon_zhiweigl.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>职位管理</p>
                    </a>
                    <a @click="$router.push('/companyInfo')">
                        <h1>
                            <div style="width: 1.1307rem">
                                <img
                                    src="../../assets/newimg/user/my_icon_qiyegl.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>企业管理</p>
                    </a>
                    <a @click="$router.push('/myDodnload')">
                        <h1>
                            <div style="width: 0.832rem; height: 0.896rem">
                                <img
                                    src="../../assets/newimg/user/my_icon_xiazai.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>我的下载</p>
                    </a>
                </div>
                <div class="j_ordernav j_ordebox">
                    <a @click="$router.push('/receiveApplication')">
                        <h1>
                            <div style="width: 0.9173rem">
                                <img
                                    src="../../assets/newimg/user/my_icon_mianshiyaoqing@2x.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>收到申请</p>
                    </a>
                    <a @click="$router.push('/InterviewInvitation')">
                        <h1>
                            <div style="width: 0.9173rem">
                                <img
                                    src="../../assets/newimg/user/my_icon_mianshiyaoqing@2x.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>面试邀请</p>
                    </a>
                </div>
            </div>
            <!-- 我的服务end -->

            <!-- 广告位start -->
            <div class="j_gaw1">
                <img src="../../assets/newimg/user/guanggao@2x@2x.png" alt="" />
            </div>
            <!-- 判断是否认证 -->
            <!-- 已认证 -->
            <div class="j_gaw2" v-show="userInfo.is_identify == 1">
                <h1>军属邀请码</h1>
                <h2>
                    <span class="invite_code">{{ userInfo.invite_code }}</span>
                    <span
                        class="copy"
                        v-clipboard:copy="userInfo.invite_code"
                        v-clipboard:success="onCopy"
                        v-clipboard:error="onError"
                        >复制</span
                    >
                </h2>
                <!-- 弹层显示 -->
                <a id="show_first" @click="chakanqinshu"
                    ><h3>
                        <span>查看亲属</span>
                        <img
                            src="../../assets/newimg/user/my_icon_gengduo@2x.png"
                            alt=""
                        /></h3
                ></a>
            </div>
            <!-- 未认证 -->
            <div
                class="j_gaw2"
                v-show="
                    userInfo.is_identify == 0 ||
                    userInfo.is_identify == -1 ||
                    userInfo.is_identify == -3
                "
            >
                <h1>军属认证</h1>
                <h2>军属认证简单介绍军属认证简单介绍</h2>
                <a
                    ><h3 @click="$router.push('/Attes')">
                        <span>上传退伍证</span>
                        <img
                            src="../../assets/newimg/user/my_icon_gengduo@2x.png"
                            alt=""
                        /></h3
                ></a>
            </div>
            <!-- 未认证，不可上传 -->
            <div class="j_gaw2" v-show="userInfo.is_identify == -2">
                <h1>军属认证</h1>
                <h2>认证审核中</h2>
            </div>
            <!-- 广告位end -->

            <div class="j_title" style="padding-top: 0.4267rem">
                <span>常用服务</span>
            </div>

            <!-- 常用服务start -->
            <div class="j_cyfw">
                <div class="j_ordernav j_cyfw_ul j_cyfw_ulnew">
                    <a @click="$router.push('/collect')">
                        <h1>
                            <div>
                                <img
                                    src="../../assets/newimg/user/my_icon_shoucang.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>我的收藏</p>
                    </a>
                    <a @click="$router.push('/alwaysQuestion')">
                        <h1>
                            <div>
                                <img
                                    src="../../assets/newimg/user/my_icon_bz.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>帮助中心</p>
                    </a>
                    <a style="display: none">
                        <h1>
                            <div>
                                <img
                                    src="../../assets/newimg/user/my_icon_zuji.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>浏览足迹</p>
                    </a>
                    <a :href="`tel:${shop_info_phone}`">
                        <h1>
                            <div>
                                <img
                                    src="../../assets/newimg/user/my_icon_kefu.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>在线客服</p>
                    </a>
                    <a @click="$router.push('/address_list')">
                        <h1>
                            <div>
                                <img
                                    src="../../assets/newimg/user/my_icon_dizhi.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>收货地址</p>
                    </a>
                    <a @click="$router.push('/swHezuo')">
                        <h1>
                            <div>
                                <img
                                    src="../../assets/newimg/user/my_icon_hezuo.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>商务合作</p>
                    </a>
                    <a @click="$router.push('/about')">
                        <h1>
                            <div>
                                <img
                                    src="../../assets/newimg/user/my_icon_about.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>关于我们</p>
                    </a>
                    <a @click="$router.push('/coupon')">
                        <h1>
                            <div>
                                <img
                                    style="width: 0.8747rem"
                                    src="../../assets/images/my_icon_youhuiq.png"
                                    alt=""
                                />
                            </div>
                        </h1>
                        <p>优惠券</p>
                    </a>
                </div>
            </div>
            <!-- 常用服务end -->

            <div class="zhanwei"></div>
        </div>

        <!--亲属列表 start-->
        <div class="shadowuser" v-if="first_leader_key"></div>
        <div class="cuidd" v-if="first_leader_key" style="display: block">
            <div class="content">
                <dl class="j_dialog_header">
                    <dd>已认证军属</dd>
                    <dd>注册时间</dd>
                </dl>
                <dl
                    class="j_dialog_content"
                    v-for="(item, index) in first_leader_list"
                    :key="index"
                >
                    <dd>{{ item.mobile }}</dd>
                    <dd>{{ item.reg_time }}</dd>
                </dl>
            </div>
            <div class="weiyi p">
                <a @click="first_leader_key = !first_leader_key">取消</a>
                <a
                    class="copy"
                    v-clipboard:copy="userInfo.invite_code"
                    v-clipboard:success="onCopy"
                    v-clipboard:error="onError"
                    >复制邀请码</a
                >
            </div>
        </div>
        <!--亲属列表 end-->
    </div>
</template>

<script>
import { axiosPost } from '../../axios';
import { Toast } from 'vant';
export default {
    name: '',
    data() {
        return {
            userInfo: {},
            first_leader_list: [],
            first_leader_key: false,
            shop_info_phone: '',
        };
    },
    computed: {},
    mounted() {
        document.body.style.overflow = '';
        this.getUserinfo();
    },
    methods: {
        //
        chakanqinshu() {
            if (this.first_leader_list.length == 0) {
                return Toast({
                    message: '暂无亲属',
                    duration: 1000,
                });
            }
            this.first_leader_key = !this.first_leader_key;
        },
        onCopy() {
            Toast({
                message: '复制成功',
                duration: 1000,
            });
        },
        onError() {
            Toast({
                message: '复制失败',
                duration: 1000,
            });
        },
        getUserinfo() {
            axiosPost('/api/user/info', {}, (res) => {
                // console.log(res);
                this.userInfo = res.data.user;
                this.shop_info_phone = res.data.shop_info_phone;
                this.first_leader_list = res.data.first_leader_list;
            });
        },
    },
};
</script>

<style lang="less" scope>
@import url('../../assets/css/personal.css');
body {
    background: #f9f8f8;
}
.shadowuser {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.5);
}
.j_cyfw_ulnew a {
    width: 2.5rem;
    margin: 0.23rem 0.5rem;
}
</style>
